<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./css/iconfont.css">
  <link rel="stylesheet" href="./css/index.css">
</head>
<body>
  <div class="header">
    <div class="left"><img src="./images/title.png" alt=""></div>
    <div class="right">
      <p>创想首页</p>
      <p>关于创想</p>
      <p>产品中心</p>
      <p>新闻资讯</p>
      <p>规划方案</p>
      <p>联系创想</p>
      <div class="search"><i class="iconfont icon-search"></i></div>
      <div class="menu"><i class="iconfont icon-sort"></i></div>
    </div>
  </div>
  <div class="swiper">
    <img src="./images/swiper.png" alt="">
  </div>
  <div class="typeBar">
    <i class="iconfont icon-back"></i>
    <div class="typeBox">
      <div>
        <img src="./images/type1.png" alt="">
        <p>儿童攀爬系列</p>
      </div>
      <div>
        <img src="./images/type2.png" alt="">
        <p>非标游乐设备</p>
      </div>
      <div>
        <img src="./images/type3.png" alt="">
        <p>打击乐器系列</p>
      </div>
      <div>
        <img src="./images/type4.png" alt="">
        <p>综合塑料玩具系列</p>
      </div>
      <div>
        <img src="./images/type5.png" alt="">
        <p>户外游乐系列</p>
      </div>
      <div>
        <img src="./images/type6.png" alt="">
        <p>儿童三轮车系列</p>
      </div>
      <div>
        <img src="./images/type7.png" alt="">
        <p>儿童家具系列</p>
      </div>
      <div>
        <img src="./images/type8.png" alt="">
        <p>桌面玩具系列</p>
      </div>
      <div>
        <img src="./images/type9.png" alt="">
        <p>摇摇乐系列</p>
      </div>
      <div>
        <img src="./images/type10.png" alt="">
        <p>儿童转椅系列</p>
      </div>
    </div>
    <i class="iconfont icon-right"></i>
  </div>
  <div class="main">
    <div class="menuBox">
      <div class="menu">
        <div class="top">
          <div>
            <p>产品分类</p>
            <span>PRODUCT CLASSIFICATION</span>
          </div>
          <i class="iconfont icon-sousuocaidan"></i>
        </div>
        <p><i class="iconfont icon-hengxian"></i>儿童攀爬系列</p>
        <p><i class="iconfont icon-hengxian"></i>非标游乐设备</p>
        <p><i class="iconfont icon-hengxian"></i>打击乐器系列</p>
        <p><i class="iconfont icon-hengxian"></i>综合塑料玩具系列</p>
        <p><i class="iconfont icon-hengxian"></i>户外游乐系列</p>
        <p><i class="iconfont icon-hengxian"></i>儿童三轮车系列</p>
        <p><i class="iconfont icon-hengxian"></i>儿童家具系列</p>
        <p><i class="iconfont icon-hengxian"></i>桌面玩具系列</p>
        <p><i class="iconfont icon-hengxian"></i>摇摇乐系列</p>
        <p><i class="iconfont icon-hengxian"></i>儿童转椅系列</p>
      </div>
    </div>
    <div class="content">
      <div class="titleBox">
        <p>儿童攀爬系列<i class="iconfont icon-round"></i></p>
        <span>CHILDREN'S CLIMBING SERIES</span>
      </div>
      <p class="intro">
        攀爬系列产品：攀爬架、攀爬滑梯、攀爬墙、攀爬洞、平衡板等功能，造型多样，可打搭配不同场所！是孩子们最喜欢的项目，可以锻炼孩子的冒险能力！
      </p>
      <div class="showBox">
        <div>
          <img src="./images/detail1.png" alt="">
          <p>儿童攀爬结构</p>
        </div>
        <div>
          <img src="./images/detail2.png" alt="">
          <p>后院攀爬结构</p>
        </div>
        <div>
          <img src="./images/detail3.png" alt="">
          <p>户外攀爬结构</p>
        </div>
        <div>
          <img src="./images/detail4.png" alt="">
          <p>儿童室内塑料滑梯</p>
        </div>
        <div>
          <img src="./images/detail5.png" alt="">
          <p>户外定制游乐场公园</p>
        </div>
        <div>
          <img src="./images/detail6.png" alt="">
          <p>儿童室内攀爬结构</p>
        </div>
        <div>
          <img src="./images/detail7.png" alt="">
          <p>木质攀爬结构</p>
        </div>
        <div>
          <img src="./images/detail8.png" alt="">
          <p>室内攀爬结构</p>
        </div>
        <div>
          <img src="./images/detail9.png" alt="">
          <p>户外定制游乐场公园</p>
        </div>
      </div>
      <div class="pageBox">
        <div><i class="iconfont icon-back"></i></div>
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <div><i class="iconfont icon-right"></i></div>

      </div>
    </div>
  </div>
  <div class="footer">
    <div class="info">
      <img src="./images/title.png" alt="">
      <p>联系方式</p>
      <p><i class="iconfont icon-phone"></i>15932348880</p>
      <p><i class="iconfont icon-youxiang"></i>浙江省温州市永嘉县桥下镇西峦村</p>
      <p><i class="iconfont icon-dingwei"></i>chuangxiang2022@126.com</p>
    </div>
    <div class="otherBox">
      <div>
        <p class="title">关于创想</p>
        <p>企业简介</p>
        <p>企业理念</p>
        <p>组织架构</p>
      </div>
      <div>
        <p class="title">创想产品</p>
        <p>儿童攀爬系列</p>
        <p>非标游乐设备</p>
        <p>打击乐器系列</p>
        <p>综合塑料玩具系列</p>
        <p>户外游乐系列</p>
        <p>儿童三轮车系列</p>
        <p>儿童家具系列</p>
        <p>桌面玩具系列</p>
        <p>摇摇乐系列</p>
        
      </div>
      <div>
        <p>儿童转椅系列</p>
        <p>儿童乐园(淘气堡)</p>
        <p>健身器材系列</p>
      </div>
      <div>
        <p class="title">新闻资讯</p>
        <p>公司新闻</p>
        <p>行业新闻</p>
      </div>
      <div>
        <p class="title">规划方案</p>
        <p>户外儿童整体规划</p>
        <p>幼儿园户外整体规划</p>
        <p>幼儿园室内整体规划</p>
      </div>
      <div>
        <p class="title">联系联想</p>
        <p>联系方式</p>
        <p>订购流程</p>
        <p>在线留言</p>
      </div>
      <div class="ewmBox">
        <img src="./images/ewm.png" alt="">
        <p>扫一扫，联系我们</p>
      </div>
    </div>
    <div class="toTopBtn"><i class="iconfont icon-shangjiantou"></i></div>
  </div>
</body>
</html>
<script>
  (function(){  
    change();  
    function change(){     
         /* 这里的html字体大小利用了一个简单书序公式（十字相乘），当我们默认设置以屏幕320px位基准此时的字体大小为20px(320    20px),那么浏览器窗口大小改变的时候新的html的fontSize（clientWidth  新的值）就是clientWidth*20/320 */
         document.documentElement.style.fontSize = document.documentElement.clientWidth*1/1403.7 + 'px';  
    }
  window.addEventListener('resize',change,false);})();
</script>